<template>
  <div class="home">
      <div class="homeTop">
          <div class="top_con">
              <el-dropdown :hide-on-click="false">
                <span class="el-dropdown-link">
                    用户<i class="el-icon-arrow-down el-icon--right"></i>
                </span>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item>个人中心</el-dropdown-item>
                    <el-dropdown-item>退出账号</el-dropdown-item>
                </el-dropdown-menu>
                </el-dropdown>
          </div>
      </div>
      <div class="homeBottom">
          <el-row>
                <el-col :span="6">
                    <div class="els">
                        <el-menu
                        default-active="2"
                        class="el-menu-vertical-demo"
                        background-color="#545c64"
                        text-color="#fff"
                        :router="true"
                        active-text-color="#ffd04b">
                            <el-menu-item index="/home/user">
                                用户列表
                            </el-menu-item>
                        </el-menu>
                    </div>
                </el-col>
                <el-col :span="18">
                    <router-view></router-view>
                </el-col>
          </el-row>
      </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.home{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    .homeTop{
        width: 100%;
        height: 45px;
        background: linear-gradient(36deg,#ffc,#ccf);
        .top_con{
            padding-left: 20px;
            margin-top: 10px;
            .el-dropdown-link {
                cursor: pointer;
                color: #409EFF;
            }
            .el-icon-arrow-down {
                font-size: 12px;
            }
        }
    }
    .homeBottom{
        flex: 1;
        background: pink;
        .el-row{
            height: 100%;
            .el-col{
                height: 100%;
                .els{
                    height: 100%;
                    .el-menu{
                        height: 100%;
                    }
                }
            }
        }
    }
}
</style>